<template>
  <base-breadcrumb>
    <a-card :bordered="false">
      <title-name title="月度考核" />

      <a-row
        :gutter="24"
        style="margin-left: -50px"
      >
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="考核月份"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="this.$route.query.months"
              disabled
            />
          </a-form-item>
        </a-col>
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="分包商名称"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="this.$route.query.name"
              disabled
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-table
        bordered
        row-key="key"
        :pagination="false"
        :columns="columns"
        :data-source="data"
        :custom-row="selectRow"
      >
        <span
          slot="serial"
          slot-scope="text, record, index"
        >{{ index + 1 }}</span>
        <template
          :slot="scoreIndex1"
          slot-scope="text, record,index"
        >
          <span v-if="record[scoreIndex1] == undefined ">{{ loginName }}</span>
          <span v-if="record[scoreIndex1] != undefined ">{{ record[scoreIndex1] }}</span>
        </template>
        <template
          :slot="scoreIndex2"
          slot-scope="text, record,index"
        >
          <span
            v-if="record[scoreIndex2] == undefined"
            class="notScore"
          >未评分 <img
            width="20px"
            height="20px"
            src="../../../assets/icons/notScore.png"
          ></span>
          <span v-if="record[scoreIndex2] != undefined ">{{ record[scoreIndex2] }}</span>
        </template>
        <template
          :slot="scoreIndex3"
          slot-scope="text, record,index"
        >
          <ellipsis
            :length="40"
            tooltip
          >
            {{ text }}
          </ellipsis>
        </template>
        <template
          :slot="scoreIndex4"
          slot-scope="text, record,index"
        >
          <ellipsis
            :length="40"
            tooltip
          >
            {{ text }}
          </ellipsis>
        </template>
        <template
          :slot="scoreIndex"
          slot-scope="text, record,index"
        >
          <span v-if="record[scoreIndex] != undefined "><BaseInputNumber
            v-model="record[scoreIndex]"
            style="width:120px"
            :max="getMaxValue(record)"
            :precision="0"
            :min="0"
            placeholder="请评分"
          /></span>
          <!--<BaseInputNumber :min="0" :max="10" :value="record['661747623019028485']"  @change="e => changeScore(e)"></BaseInputNumber>-->
          <span v-if="record[scoreIndex] == undefined "><BaseInputNumber
            v-model="record[scoreIndex]"
            style="width:120px"
            :max="getMaxValue(record)"
            :precision="0"
            :min="0"
            placeholder="请评分"
          /></span>
        </template>
      </a-table>
    </a-card>

    <div class="page-btn-right-top">
    <!-- <div style="float: right;margin-top: 20px"> -->
      <a-button
        type="primary"
        style="margin-right: 20px"
        @click="submit"
      >
        提交
      </a-button>
      <a-button
        type="primary"
        @click="returnBack"
      >
        关闭
      </a-button>
    </div>
  </base-breadcrumb>
</template>

<script>
import { STable, Ellipsis } from '@/components'
import {
  getMonthHeaders,
  getMonthContents,
  getMonthAapprove,
} from '@/api/subcontractors/monthAssessment'

import ARow from 'ant-design-vue/es/grid/Row'

export default {
  name: 'a' + Date.now(),
  components: {
    ARow,
    Ellipsis
  },
  data() {
    return {
      columns: [],
      assessmentId: '',
      selectedRow: {},
      scoreIndex: '',  // 实际评分的dataIndex
      scoreIndex1: '', // 实际考核人员的dataIndex
      scoreIndex2: '', // 状态的dataIndex

      scoreIndex3: '', // 扣分标准的dataIndex
      scoreIndex4: '', // 主要检查的dataIndex
      data: [],
      loginName: ''
    }
  },

  created() {
    this.assessmentId = this.$route.query.assessmentId
    this.loginName = JSON.parse(sessionStorage.getItem('ycloud-user_info')).name
    this.getMonthHeaders()
    this.getMonthContents()
  },
  computed: {},
  methods: {
    // 获取输入最大评分值
    getMaxValue(data) {
      const targetData = this.columns.find(item => item.code === '4') // 考核评分列
      return targetData && Number(data[targetData['dataIndex']]) || 0
    },

    getMonthHeaders() {
      getMonthHeaders({ id: this.assessmentId }).then(res => {
        this.columns = res.data
        let obj = {
          'dataIndex': 'serial',
          'formId': null,
          'title': '序号',
          'code': '0',
          'sort': 0,
          'inputType': null,
          scopedSlots: { customRender: 'serial' }
        }
        this.columns.unshift(obj)

        let objScore = {}   // 实际评分
        let objScore1 = {}   // 实际考核人员
        let objScore2 = {}   // 状态

        let objScore3 = {}   // 扣分标准
        let objScore4 = {}   // 主要检查内容

        this.columns.forEach(item => {
          objScore = this.columns.filter(item => item.title == '实际评分')
          objScore1 = this.columns.filter(item => item.title == '实际考核人员')
          objScore2 = this.columns.filter(item => item.title == '状态')

          objScore3 = this.columns.filter(item => item.title == '扣分标准')
          objScore4 = this.columns.filter(item => item.title == '主要检查内容')

        })
        objScore[0].scopedSlots = { customRender: objScore[0].dataIndex }
        objScore1[0].scopedSlots = { customRender: objScore1[0].dataIndex }
        objScore2[0].scopedSlots = { customRender: objScore2[0].dataIndex }

        objScore3[0].scopedSlots = { customRender: objScore3[0].dataIndex }
        objScore4[0].scopedSlots = { customRender: objScore4[0].dataIndex }

        this.scoreIndex = objScore[0].dataIndex
        this.scoreIndex1 = objScore1[0].dataIndex
        this.scoreIndex2 = objScore2[0].dataIndex

        this.scoreIndex3 = objScore3[0].dataIndex
        this.scoreIndex4 = objScore4[0].dataIndex


      })
    },

    // 提交
    submit() {
      let arr = []
      let arrys = this.data

      for (var i = 0; i < arrys.length; i++) {
        for (var k in arrys[i]) {
          if (this.scoreIndex == k) {
            arr.push({
              id: arrys[i].id,
              scoreCont: arrys[i][k],
              scoreIndex1: JSON.parse(sessionStorage.getItem('ycloud-user_info')).name,
              scoreIndex2: arrys[i][k] == null ? '未评分' : '已评分'
            })
          }
        }
      }


      if (arr.length != this.data.length) {
        this.$message.error('请先填写实际评分！')
        return
      }

      try {
        arr.forEach(function(obj, i) {
          if (obj.scoreCont == null) {
            throw  new Error('EndMessage')
          }
        })
      } catch (e) {
        if (e.message == 'EndMessage') {
          this.$message.error('实际评分不能为空，核对后请重新输入！')
          return
        }
      }

      let newData = JSON.parse(JSON.stringify(arr).replace(/scoreCont/g, this.scoreIndex))
      let newData1 = JSON.parse(JSON.stringify(newData).replace(/scoreIndex1/g, this.scoreIndex1))
      let newData2 = JSON.parse(JSON.stringify(newData1).replace(/scoreIndex2/g, this.scoreIndex2))

      this.$confirm({
        title: '温馨提示',
        content: '提交后数据不可再次考核，确定提交吗？',
        okText: '确认',
        okType: 'danger',
        cancelText: '取消',
        onOk: () => {

          getMonthAapprove({ contentList: newData2, id: this.assessmentId }).then(res => {
            if (res.code == 200 || res.data.code == 200) {
              this.$message.success('提交成功！')
              this.$multiTab.close(this.$route.fullpath)
              this.getMonthContents()
            } else {
              this.$message.error('提交失败！')
            }
          })
        }
      })

    },
    getMonthContents() {
      getMonthContents({ id: this.assessmentId }).then(res => {
        this.data = res.data
      })
    },
    selectRow(record) {
      return {
        on: {
          click: () => {
            this.selectedRow = record   // 当前行数据
          }
        }
      }
    },


    returnBack() {
      this.$multiTab.close(this.$route.fullpath)
    }
  }
}
</script>
<style scoped>
.notScore {
  width: 65px;
  display: flex
}
</style>

